<!-- 
  向导组件

  用法：
    <qm-guide-button>启动向导</qm-guide-button>

  说明：
    modulePath："向导管理"定义的模块路径，如果不传，默认取当前路由的path
-->
<template>
  <el-button
    :size="size"
    :type="type"
    :plain="plain"
    :round="round"
    :circle="circle"
    :loading="loading"
    :disabled="disabled"
    :icon="icon"
    :autofocus="autofocus"
    @click="startGuide"
  >
    <slot></slot>
  </el-button>
</template>

<script>
import { loadManualTriggerGuide } from "@/utils/guide";

export default {
  name: "qm-guide-button",
  props: {
    size: {
      type: String,
      default: "small"
    },
    type: {
      type: String,
      default: "primary"
    },
    plain: {
      //是否朴素按钮
      type: Boolean,
      default: false
    },
    round: {
      //是否圆角按钮
      type: Boolean,
      default: false
    },
    circle: {
      //是否圆形按钮
      type: Boolean,
      default: false
    },
    loading: {
      //是否加载中状态
      type: Boolean,
      default: false
    },
    disabled: {
      //是否禁用状态
      type: Boolean,
      default: false
    },
    icon: {
      type: String
    },
    autofocus: {
      //是否默认聚焦
      type: Boolean,
      default: false
    },
    // 向导模块路径，如果没有传，默认取当前路由的path
    modulePath: {
      type: String
    }
  },
  methods: {
    startGuide() {
      let path = this.modulePath ? this.modulePath : this.$route.path;
      if (!path) {
        throw new Error("Invalid path[" + path + "]...");
      }
      loadManualTriggerGuide(path, true);
    }
  }
};
</script>
